require(['./config'],() => {
  require(['template','header','footer'],(template,header)=>{
    class Shopping {
      constructor () {
        this.init()
        this.delateshop()
        this.shopshuliangjia()
        this.jisuanzongjia()
      }
      init () {
        const info = JSON.parse(localStorage.getItem("info"))
        if(info) {
          $("tbody").html(template('shopTable', { info }))
        }else {
          $("tbody").html(`购物车是空的，请去<a href="/html/zhounianzhuanqu.html?id=2">添加宝贝</a>`)
        }
        this.checksl()
        this.info = info
        this.check()
      }
      checksl () {
          const checks = Array.from(document.getElementsByClassName("checks"))
          const res = checks.every((item) => {
            return item.checked
          })
          if(res) {
            $("#all-check").prop("checked", true)
          }else {
            $("#all-check").prop("checked", false)
          }
      }
      //全选和单选
      check () {
        $('tbody').on('change',"#all-check",(e) => {
          $(".checks").prop('checked',$(e.target).prop("checked"))
          var falg = e.target.checked
          var arr = this.info.map(item =>{
            if(item.check !== falg){
              item.check = falg
            }
           return item
          } )
          localStorage.setItem("info",JSON.stringify(arr))
          this.jisuanzongjia()
          header.CartNumber()
        })
        $('tbody').on('change',".checks", (e) =>{
          const shoptr = e.target.parentNode.parentNode,
                id = shoptr.getAttribute("data-id")
                var arr1 = this.info.map((item)=>{
                  if(item.id === id ) {
                       item.check = !item.check
                      }
                     return item
                    })
                    localStorage.setItem("info",JSON.stringify(arr1))
              this.checksl()
              this.jisuanzongjia()
              header.CartNumber()
            })
      }
      //删除商品
      delateshop () {
        $('tbody').on('click','.delatebtn', (e) => {
          const shoptr = e.target.parentNode.parentNode,
                id = shoptr.getAttribute("data-id")
           var arr = this.info.filter((item)=>{
                return item.id != id
              })
              localStorage.clear()
              localStorage.setItem("info",JSON.stringify(arr))
              this.init()
              this.check()
              this.jisuanzongjia()
              header.CartNumber()
        })
      }
      //数量加和减
      shopshuliangjia() {
        $('tbody').on('click',(e) => {
          let shoptr = e.target.parentNode.parentNode,
          id = shoptr.getAttribute("data-id")
          // info = JSON.parse(localStorage.getItem("info"))
          if(e.target.className == 'shuliangdown'){
            this.info.forEach(item => {
              if(id === item.id) {
                item.num++
                localStorage.setItem("info",JSON.stringify(this.info))
                this.init()
                this.jisuanzongjia()
                header.CartNumber()
              }
            })
          }else if (e.target.className == 'shuliangup') {
            this.info.forEach(item => {
              if(id === item.id) {
                if(item.num <= 1){
                  item.num = 1
                }else {
                  item.num--
                  localStorage.setItem("info",JSON.stringify(this.info))
                  this.init()
                  this.jisuanzongjia()
                  header.CartNumber()
                }
              }
            })
          }
        })
      }
      //计算总价
      jisuanzongjia () {
        if(this.info){
          var shaixuan = this.info.filter(item => {
            return item.check
          })
          var zj = shaixuan.reduce((total,shop)=>{
            if(shop.check)total += shop.price* shop.num
            return total
        },0)
          $(".money").html(zj.toFixed(2))
        }
      }
    }
    new Shopping()
  })
})